<template>
    <div>
        <el-form ref="form" :model="form" label-width="80px">
            <el-card class="box-card incom">
                <div class="iptBox">
                    <p class="title">收支状况</p>
                    <el-form-item label="收支状况" required>
                        <el-input class="" v-model="form.name"></el-input>
                    </el-form-item>
                </div>
            </el-card>
            <el-card class="box-card">
                <p class="title">家庭联系人</p>
                <div class="iptBox">
                    <el-form-item label="关系1" required>
                        <el-input v-model="form.name"></el-input>
                    </el-form-item>
                </div>
                <div class="iptBox">
                    <el-form-item label="电话" required>
                        <el-input v-model="form.name"></el-input>
                    </el-form-item>
                </div>
                <div class="iptBox">
                    <el-form-item label="姓名" required>
                        <el-input v-model="form.name"></el-input>
                    </el-form-item>
                </div>
            </el-card>
            <el-card class="box-card">
                <p class="title">工作证明人</p>
                <div class="iptBox">
                    <el-form-item label="关系2" required>
                        <el-input class="" v-model="form.name"></el-input>
                    </el-form-item>
                </div>
                <div class="iptBox">
                    <el-form-item label="姓名" required>
                        <el-input class="" v-model="form.name"></el-input>
                    </el-form-item>
                </div>
                <div class="iptBox">
                    <el-form-item label="电话" required>
                        <el-input class="" v-model="form.name"></el-input>
                    </el-form-item>
                </div><br />
                <div class="iptBox">
                    <el-form-item label="部门" required>
                        <el-input class="" v-model="form.name"></el-input>
                    </el-form-item>
                </div>
                <div class="iptBox">
                    <el-form-item label="职位" required>
                        <el-input class="" v-model="form.name"></el-input>
                    </el-form-item>
                </div>
                <div class="iptBox">
                    <el-form-item label="备注">
                        <el-input type="textarea"></el-input>
                    </el-form-item>
                </div>
            </el-card>
            <el-form-item>
                <el-button type="primary" @click="onSubmit">立即创建</el-button>
                <el-button>取消</el-button>
            </el-form-item>
        </el-form>
    </div>
</template>

<script>
export default {
    data() {
        return {
            form: {
                name: '',
                region: '',
                date1: '',
                date2: '',
                delivery: false,
                type: [],
                resource: '',
                desc: ''
            }
        }
    },
    methods: {
        onSubmit() {
            console.log('submit!');
        }
    }
}
</script>

<style scoped>
.text {
    font-size: 14px;
}

.box-card {
    width: 100%;
    margin: 8px 0;
}

.incom {
    padding: 0;
    margin: 0;
}

.iptBox {
    float: left;
    width: 40%;
}

.title {
    text-align: left;
    line-height: 10px;
    height: 50px;
}
</style>
